﻿/*-------------------------- Affinity Redesign Styles ----------------------------*/
/*-------------------------------- By Laura Hsu ----------------------------------*/
/*----------------------------- Updated 07/09/2021 -------------------------------*/

/*----------------------------------- Imports ------------------------------------*/

@import url('https://fonts.googleapis.com/css?family=Montserrat:400,700&display=swap');

/*-------------------------------- Layout Styles ---------------------------------*/

.split__main > div:first-of-type, .split__main > div:nth-of-type(2), .split__main > div:nth-of-type(3) {
	display:none;
}

#AffinityContainer {
	width:100%;
	background-image:url('/aboutus/membership/membershipandbenefits/PublishingImages/Lady-Justice-800h.jpg');
	background-size:auto;
	background-repeat:no-repeat;
	background-position:150% center;
}

/*--------------------------------- Text Styles ----------------------------------*/

.split__main .ms-rtestate-field h1 {
	font-family:'Montserrat',sans-serif;
	font-weight:bold;
	font-size:2.5rem;
	color:#9e2a52;
	text-transform:uppercase;
	letter-spacing:3px;
	margin-top:0;
}

.split__main .ms-rtestate-field h1 span {
	font-weight:normal;
	font-size:1.5rem;
	color:#666;
	text-transform:none;
	letter-spacing:2px;
}

.split__main .ms-rtestate-field h2 {
	width:95%;
	box-shadow:3px 3px 3px #333;
	font-family:'Montserrat',sans-serif;
	font-size:1.5rem;
	color:#fff;
	background-color:#666;
	padding:8px 8px 8px 20px;
	letter-spacing:1px;
	margin-block-start:0px;
	margin-top:0px;
}

#AffinityContainer h2 {
	width:75%;
	font-size:1.5rem;
	margin:0;
}

h2 a, h2 a:active, h2 a:visited, #AffinityContainer a:visited, h2 a:link, h2 a:hover {
	font-family:'Montserrat',sans-serif;
	color:#fff;
	text-decoration:none;
	display:block;
	width:100%;
	transition:0.1s ease all;
}

h2 a:hover {
	text-decoration:none;
	text-shadow:2px 2px 5px #000;
}

.split__main .ms-rtestate-field h3 {
	font-family:'Montserrat',sans-serif;
	font-size:1.75rem;
}

.split__main .ms-rtestate-field h4 {
	font-family:'Montserrat',sans-serif;
	font-size:1.25rem;
}

h3 a, h3 a:active, h3 a:visited, h3 a:link, h4 a, h4 a:active, h4 a:visited, h4 a:link {
	color:inherit !important;
}

p {
	font-family:"Helvetica Neue",Helvetica,sans-serif;
}

ul.summaryBox {
	background-color:#fcfcfc;
}

ul.summaryBox li {
	font-family:'Montserrat',sans-serif;
	font-weight:bold;
}


/*------------------------------- Heading Classes --------------------------------*/
/*------------------------ Contains Button Color Styles --------------------------*/

.ms-rtestate-field h2.darkmauve, .ms-rtestate-field .darkmauve {
	background-color:#695c62;
}
.ms-rtestate-field h2.citrine, .ms-rtestate-field .citrine {
	background-color:#f99d1c;
}
.ms-rtestate-field h2.bloodorange, .ms-rtestate-field .bloodorange {
	background-color:#f15a31;
}
.ms-rtestate-field h2.sbwteal, .ms-rtestate-field .sbwteal {
	background-color:#005c84;
}
.ms-rtestate-field h2.coolred, .ms-rtestate-field .coolred {
	background-color:#c4161c;
}
.ms-rtestate-field h2.limegreen, .ms-rtestate-field .limegreen {
	background-color:#a6ce39;
}
.ms-rtestate-field h2.turquoise, .ms-rtestate-field .turquoise {
	background-color:#00a8b5;
}
.ms-rtestate-field h2.kellygreen, .ms-rtestate-field .kellygreen {
	background-color:#00a44d;
}
.ms-rtestate-field h2.goldenrod, .ms-rtestate-field .goldenrod {
	background-color:#d7b829;
}
.ms-rtestate-field h3.darkmauvefont {
	color:#695c62;
}
.ms-rtestate-field h3.citrinefont {
	color:#f99d1c;
}
.ms-rtestate-field h3.bloodorangefont {
	color:#f15a31;
}
.ms-rtestate-field h3.sbwtealfont {
	color:#005c84;
}
.ms-rtestate-field h3.coolredfont {
	color:#c4161c;
}
.ms-rtestate-field h3.limegreenfont {
	color:#a6ce39;
}
.ms-rtestate-field h3.turquoisefont {
	color:#00a8b5;
}
.ms-rtestate-field h3.kellygreenfont {
	color:#00a44d;
}
.ms-rtestate-field h3.goldenrodfont {
	color:#d7b829;
}

/*-------------------------------- Button Styles ---------------------------------*/

a.moreButton, a.moreButton:link, a.moreButton:visited, a.moreButton:active {
	display:inline-block;
	padding:3px 15px;
	border-radius:5px;
	color:#fff;
	text-decoration:none;
	font-family: 'Montserrat', sans-serif;
	font-weight:bold;
	font-size:1rem;
}

/*---------------------------------- Tile Styles ---------------------------------*/
.affinityTile img {
	height: 300px;
	margin-bottom:1rem;
	opacity:1.0!important;
	transition: .3s ease all;

	
}
.affinityTile img:hover {
	opacity:0.7!important;
}
